//生产管理系统/报警管理/报警详情

import React, { Component } from 'react';
import { connect } from 'dva';
import {  Card, Input  } from 'antd';
import style from './DetailsAlarm.less';
import PublicService from '../../../services/PublicService'
import moment from 'moment'
import {AlarDetails} from '../../../services/redmoe';
import request from '../../../utils/request';
import DetailsEcharts from '../sub/DetailsEcharts'







class DetailsAlarm extends Component {
    state={
        createTime:'',
        monitorName:'',
        rank:'',
        site:'',
        Xarr:[],
        Yarr:[]
    }
   
componentDidMount(){
    console.log(this.props)
    
    let id ={
        id:PublicService.getCookie('DetailsId')
    }
    AlarDetails({...id}).then(data => {
        console.log(data)
       
        if(data.data.rc == 0) {
            let {createTime,monitorName,rank,site} = data.data.ret.alarm
            createTime= moment(createTime).format("YYYY-MM-DD HH:mm:ss")
            this.setState({
                createTime,
                monitorName,
                rank,
                site
            })
          var Xarr =  data.data.ret.timeList.map(item => {
            return moment(item).format(" HH时mm分ss秒")
            })
           
        console.log(Xarr)
        this.setState({
            Xarr,
            Yarr:data.data.ret.valueList
        })
          
           
        }
    })

}


render() {

const {createTime,monitorName,rank,site} = this.state
        

        return (
            <div>

                        <Card
                            className={style.CardTop}
                            bodyStyle={{paddingTop:12}}
                        >
                      报警设备/点位名称:<Input size="small" value={site} disabled={true} style={{width:172,marginRight:20}}/> 
                      报警时间: <Input size="small" value={createTime} style={{width:144,marginRight:20}} disabled={true} />
                      报警等级: <Input size="small" value={rank} style={{width:72,marginRight:20}} disabled={true}/>
                      报警信息描述: <Input size="small" value={monitorName}  style={{width:180}} disabled={true}/>

                        </Card>
                        <Card
                            className={style.CardBottom}

                        >
                           
                           <DetailsEcharts
                           Xarr={this.state.Xarr}
                           Yarr={this.state.Yarr}
                           />
                            
                        </Card>
                     
                        
            </div>
        )
    }
}

export default connect()(DetailsAlarm)